<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="referrer" content="no-referrer" />
    <title>Title</title>

</head>
<body>

<!--导航栏-->
<nav class="navbar navbar-default" th:fragment="navigation" style="height: 0px;">
    <div class="navbar-header">
        <a class="navbar-brand" th:href="@{/}">工大选课系统</a>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

        <ul class="nav navbar-nav navbar-right">
            <li role="presentation" th:if="${loginUser != null}">
                <a th:href="@{/notice/comment}">通知
                    <span class="badge" th:if="${noticeCount > 0}" th:text="${noticeCount}"
                          style="margin-top: -3px;">3</span>
                </a>
            </li>

            <li class="dropdown" style="margin-right: 7px;" th:if="${loginUser == null}">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                   aria-expanded="false">登录<span class="caret"></span></a>
                <ul class="dropdown-menu">
                    <li role="separator" class="divider"></li>
                    <li><a th:href="@{/login-phone}">手机号登录</a></li>
                    <li role="separator" class="divider"></li>
                    <li><a th:href="@{/login}">帐号密码登录</a></li>

                </ul>
            </li>

            <li th:if="${loginUser != null}">
                <img th:src="${loginUser.avatarUrl}" alt="..." class="img-circle"
                     style="width: 34px;margin-top: 9px;margin-right: 4px;">
            </li>

            <li class="dropdown" th:if="${loginUser != null}">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                   aria-expanded="false">
                    <span th:text="${loginUser.name}">我的</span>
                    <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a th:href="@{|/profile/myself/${loginUser.id}|}">个人中心</a></li>
                    <li role="separator" class="divider"></li>
                    <li><a th:href="@{/logout}">退出登录</a></li>
                </ul>
            </li>
        </ul>
    </div>
</nav>

<!--分页-->
<nav aria-label="Page navigation" th:fragment="pagination" th:if="${page.totalSize > page.limit}">
    <ul class="pagination" style="margin-left: 485px">
        <li>
            <a th:href="@{${page.path}}" aria-label="Previous">
                <span aria-hidden="true">首页</span>
            </a>
        </li>
        <li th:class="|${page.page == 1 ? 'disabled' : ''}|">
            <a th:href="@{${page.path}(page=${page.page - 1})}" th:if="${page.page != 1}">上一页</a>
            <a href="javascript:void(0);" th:if="${page.page == 1}">上一页</a>
        </li>
        <li th:class="|${page.page == i ? 'active' : ''}|" th:each="i:${#numbers.sequence(page.from, page.to)}">
            <a th:href="@{${page.path}(page=${i})}" th:text="${i}">1</a>
        </li>
        <li th:class="|${page.page == page.totalPage ? 'disabled' : ''}|">
            <a th:href="@{${page.path}(page=${page.page + 1})}"
               th:if="${page.page != page.totalPage}">下一页</a>
            <a href="javascript:void(0);" th:if="${page.page == page.totalPage}">下一页</a>
        </li>
        <li>
            <a th:href="@{${page.path}(page=${page.totalPage})}" aria-label="Next">
                <span aria-hidden="true">末页</span>
            </a>
        </li>
    </ul>
</nav>

<!--右边 已选课程-->
<div class="col-xs-12 col-lg-3 col-md-12" th:fragment="selectedCourse">
    <h3>已选课程</h3>
    <hr>
    <h4 th:each="course: ${selectedCourse}">
        <li style="font-size: 17px; margin-top: 5px;">
            <span th:text="${course.name}">课程名称</span>-<span th:text="${course.teacher}">教师</span>

            <a href='javascript:void(0);' th:onclick="dropCourse()">
                <span class="label label-danger" style="padding-bottom: 2px;">退课</span>
            </a>
        </li>
    </h4>
</div>

</body>



</html>